<template>
    <div>
      <el-dialog
        title="批量制定发货通知计划"
        :visible.sync="orderPlanNoticeVisible"
        :fullscreen="true"
        ref="multipleDialogByBox"
        :before-close="handleClose"
      >

        <el-form
          ref="dataForm"
          label-width="120px"
          label-position="left"
          style="margin-left:30px"
        >

          <el-form-item label="发货车辆" style="width: 400px">
            <el-select v-model="licencePlateId" clearable filterable placeholder="请选择">
              <el-option
                v-for="item in licencePlateList"
                :key="item.id"
                :label="item.name"
                :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="发货日期" style="width: 400px">
            <el-date-picker
              v-model="deliveryTime"
              align="right"
              type="date"
              placeholder="选择日期"
              value-format="yyyy-MM-dd HH:mm:ss"
            >
            </el-date-picker>

          </el-form-item>

          <el-form-item label="预计到达时间" style="width: 400px">
            <el-date-picker
              v-model="arriveTime"
              align="right"
              type="date"
              placeholder="选择日期"
              value-format="yyyy-MM-dd HH:mm:ss"
            >
            </el-date-picker>

          </el-form-item>

          <el-form-item label="运费含税" style="width: 400px">

            <el-radio-group v-model="taxInclusive" >
              <el-radio :label="0" border>不含税</el-radio>

              <el-radio :label="1" border>含税</el-radio>

            </el-radio-group>
          </el-form-item>

          <el-form-item
            prop="freight"
            label="运费"
            style="width: 400px"
          >
            <template slot-scope="scope">
              <el-input-number controls-position="right" size="small" :min="0"  v-model="freight"  placeholder="运费"></el-input-number>
            </template>

          </el-form-item >

          <el-form-item
            prop="totalWeightInfo"
            label="重量"
            style="width: 400px"
          >
            <template slot-scope="scope">
              <el-input-number controls-position="right" size="small" :min="0"  v-model="totalWeightInfo"  placeholder="重量"></el-input-number>
            </template>

          </el-form-item>

          <el-form-item
            prop="remark"
            label="备注"
            style="width: 400px"
          >
            <template slot-scope="scope">
              <el-input type="textarea" controls-position="right" size="small" :min="0"  v-model="remark" placeholder="备注"></el-input>
            </template>
          </el-form-item>

        </el-form>

        <el-table
          :data="tableListData"
          border
          style="display: inline-block">
          <el-table-column
            prop="contractNo"
            label="合同编号"
            align="center"
            width="150"
          >
            <template slot-scope="scope">
              <el-input controls-position="right" size="small" readOnly  v-model="scope.row.contractNo" placeholder="合同编号"></el-input>
            </template>
          </el-table-column>
          <el-table-column
            prop="orderNo"
            label="订单编号"
            align="center"
            width="170"
          >
            <template slot-scope="scope">
              <el-input controls-position="right" size="small" readOnly  v-model="scope.row.orderNo" placeholder="订单编号"></el-input>
            </template>
          </el-table-column>

          <el-table-column
            prop="productNo"
            label="产品名称"
            align="center"
            width="150"
          >
            <template slot-scope="scope">
              <el-input controls-position="right" size="small" readOnly  v-model="scope.row.productNo" placeholder="产品名称"></el-input>
            </template>
          </el-table-column>

          <el-table-column
            prop="clientName"
            label="客户名称"
            align="center"
            width="150"
          >
            <template slot-scope="scope">
              <el-input controls-position="right" size="small"  v-model="scope.row.clientName" placeholder="客户名称"></el-input>
            </template>
          </el-table-column>

          <el-table-column
            prop="productWeight"
            label="克重"
            width="130"
            align="center"
          >
            <template slot-scope="scope">
              <el-input-number controls-position="right" size="small" :min="0"  v-model="scope.row.productWeight" placeholder="克重"></el-input-number>
            </template>
          </el-table-column>

          <el-table-column
            prop="unitPrice"
            label="单价（光瓶）"
            width="110"
            align="center"
          >
            <template slot-scope="scope">
              <el-input controls-position="right" size="small"  v-model="scope.row.unitPrice" placeholder="单价（光瓶）"></el-input>
            </template>
          </el-table-column>

          <el-table-column
            prop="orderProductNumber"
            label="订单数量"
            width="150"
            align="center"
          >
            <template slot-scope="scope">
              <el-input-number controls-position="right" size="small" :min="0"  v-model="scope.row.orderProductNumber"  placeholder="数量"></el-input-number>
            </template>
          </el-table-column>

          <el-table-column
            prop="putInStorageNumber"
            label="库存数量"
            width="130"
            align="center"
          >
            <template slot-scope="scope">
              <el-input-number controls-position="right" size="small" :min="0"  v-model="scope.row.putInStorageNumber"  placeholder="库存数量"></el-input-number>
            </template>
          </el-table-column>

          <el-table-column
            prop="leaveStorageNumber"
            label="已发数量"
            width="130"
            align="center"
          >
            <template slot-scope="scope">
              <el-input-number controls-position="right" size="small" :min="0"  v-model="scope.row.leaveStorageNumber"  placeholder="已发数量"></el-input-number>
            </template>
          </el-table-column>

          <el-table-column
            prop="deliveryType"
            label="发货类型"
            align="center"
            width="140"
          >
            <template slot-scope="scope">
              <el-select v-model="scope.row.deliveryType" clearable filterable   placeholder="发货类型">
                <el-option label="按数量"   :value=0>按数量</el-option>
                <el-option label="全发"  :value=1>全发</el-option>
              </el-select>
            </template>
          </el-table-column>

          <el-table-column
            prop="deliveryNumber"
            label="发货数量"
            align="center"
          >
            <template slot-scope="scope">
              <el-input-number size="small" controls-position="right"  v-model="scope.row.deliveryNumber" placeholder="发货数量"></el-input-number>
            </template>
          </el-table-column>

          <el-table-column
            prop="weightInfo"
            label="重量(吨)"
            align="center"
          >
            <template slot-scope="scope">
              <el-input-number size="small" controls-position="right"  v-model="scope.row.weightInfo" placeholder="重量(吨)"></el-input-number>
            </template>
          </el-table-column>

          <el-table-column
            prop="deliveryAddress"
            label="收货地址"
            width="200"
            align="center"
          >
            <template slot-scope="scope">
              <el-input type="textarea" controls-position="right" size="small" :min="0"  v-model="scope.row.deliveryAddress" placeholder="收货地址"></el-input>
            </template>
          </el-table-column>

        </el-table>


        <span slot="footer" class="dialog-footer">
        <el-button @click="orderPlanNoticeVisible = false">取 消</el-button>
        <el-button type="primary" @click="saveConsignNoteInfo">确 定</el-button>
      </span>

      </el-dialog>
    </div>
</template>

<script>
  import {mRequest} from '../utils/request'
  export default {
    name: "multipleDialogByBox",
    data() {
      return {
        orderPlanNoticeVisible: false,
        licencePlateId: '',
        deliveryTime: '',
        arriveTime:'',
        taxInclusive: '',
        licencePlateList: [],
        freight: '',
        remark: '',
        totalWeightInfo: '',
      }
    },
    props: {
      tableListData: {
        type: Array,
        request: true,
        default: () => []
      }
    },
    methods: {
      showOrderPlanNoticeDialog() {
        this.orderPlanNoticeVisible = true
      },
      handleClose(done) {
        this.$confirm('确认关闭？')
          .then(_ => {
            done();
          })
          .catch(_ => {
          });
      },
      saveConsignNoteInfo() {

        mRequest("consignApi/saveConsignNoteAndDetailList", {
          'deliveryTime': this.deliveryTime,
          'arriveTime': this.arriveTime,
          'licencePlateId': this.licencePlateId,
          'taxInclusive': this.taxInclusive,
          'freight': this.freight,
          'totalWeightInfo': this.totalWeightInfo,
          'remark': this.remark,
          'onlineTime': this.onlineTime,
          'deviceId': this.deviceId,
          'tableListData': this.tableListData
        }, (res => {
          let data = res.data
          if (data && data.code == 0) {

            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500,
              onClose: () => {
                this.orderPlanNoticeVisible = false
                this.getDataList()
          //      this.$emit('refreshDataList')
              }
            })
          } else {
            this.$message.error(data.msg)
          }
        }))
      },
    }
  }
</script>

<style scoped>

</style>
